<template>
  <div>
    <h1>Friend</h1>
    <button @click="goMy">去 My</button>
    <button @click="goMySimple">简写params传参 - 就传一个动态值</button>
    <hr />
    <hr />
    开始挖个坑
    <router-link to="/part/a">朋友A</router-link>
    <router-link to="/part/b">朋友B</router-link>
    <router-link to="/part/c">朋友C</router-link>
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  name: "FriendPage",
  methods: {
    goMy() {
      // path会忽略 params
      // this.$router.push({
      //   path: "/my",
      //   params: {
      //     xxx: 1,
      //   },
      // });
      // 要带params必须通过name的这种跳转方式
      this.$router.push({
        name: "my",
        params: {
          xxx: 1,
          a: 2,
          b: true,
        },
        query: {
          c: 3,
          d: 4,
        },
      });
    },
    goMySimple() {
      this.$router.push("/my/123");
    },
  },
};
</script>

<style>
</style>